<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
<th:block th:include="include :: header('大小详情')" />
</head>
<body class="white-bg">
	<div class="ibox-content">
		<table class="table table-bordered">
			<tr>
				<td colspan="9" style="text-align: center;" id="title"></td>
			</tr>
			<tr>
				<td style="text-align: center;"></td>
				<td style="text-align: center;">外围网盘<br>口赔率</td>
				<td style="text-align: center;">竞彩网总<br>进球0赔率</td>
				<td style="text-align: center;">竞彩网总<br>进球1赔率</td>
				<td style="text-align: center;">竞彩网总<br>进球2赔率</td>
				<td style="text-align: center;">竞彩网总<br>进球3赔率</td>
				<td style="text-align: center;">竞彩网总<br>进球4赔率</td>
				<td style="text-align: center;">下注总额</td>
				<td style="text-align: center;">利润</td>
			</tr>
			<tr>
				<td style="text-align: center;">赔率</td>
				<td style="text-align: center;font-weight: bold;" id="oddsForPeripheryO2_5"></td>
				<td style="text-align: center;font-weight: bold;" id="oddsForOneTotalBalls"></td>
				<td style="text-align: center;font-weight: bold;" id="oddsForTwoTotalBalls"></td>
				<td style="text-align: center;font-weight: bold;" id="oddsForThreeTotalBalls"></td>
				<td style="text-align: center;font-weight: bold;" id="oddsForFourTotalBalls"></td>
				<td style="text-align: center;font-weight: bold;" id="oddsForFiveTotalBalls"></td>
				<td style="text-align: center;"></td>
				<td style="text-align: center;"></td>
			</tr>
			<tr>
				<td style="text-align: center;">下注率</td>
				<td style="text-align: center;width: 10px;"><input type="number" id="betMoneyForPeripheryO2_5" /></td>
				<td style="text-align: center;color: red;font-weight: bold;" id="betMoneyForOneTotalBalls"></td>
				<td style="text-align: center;color: red;font-weight: bold;" id="betMoneyForTwoTotalBalls"></td>
				<td style="text-align: center;color: red;font-weight: bold;" id="betMoneyForThreeTotalBalls"></td>
				<td style="text-align: center;color: red;font-weight: bold;" id="betMoneyForFourTotalBalls"></td>
				<td style="text-align: center;color: red;font-weight: bold;" id="betMoneyForFiveTotalBalls"></td>
				<td style="text-align: center;color: red;font-weight: bold;" id="totalExpense"></td>
				<td style="text-align: center;color: red;font-weight: bold;" id="profit"></td>
			</tr>
		</table>
	</div>
	<th:block th:include="include :: footer" />
	<script type="text/javascript">
		var dxDetail = localStorage.getItem("dxDetail");
		if(dxDetail){
			dxDetail = JSON.parse(dxDetail);
			$(function(){
				$('#title').text(dxDetail.title);
				$('#oddsForPeripheryO2_5').text(dxDetail.oddsForPeripheryO2_5);
				$('#oddsForOneTotalBalls').text(dxDetail.oddsForOneTotalBalls);
				$('#oddsForTwoTotalBalls').text(dxDetail.oddsForTwoTotalBalls);
				$('#oddsForThreeTotalBalls').text(dxDetail.oddsForThreeTotalBalls);
				$('#oddsForFourTotalBalls').text(dxDetail.oddsForFourTotalBalls);
				$('#oddsForFiveTotalBalls').text(dxDetail.oddsForFiveTotalBalls);
				$('#betMoneyForPeripheryO2_5').val(dxDetail.betMoneyForPeripheryO2_5);
				$('#betMoneyForOneTotalBalls').text(parseFloat(dxDetail.betMoneyForOneTotalBalls).toFixed(2)+'元');
				$('#betMoneyForTwoTotalBalls').text(parseFloat(dxDetail.betMoneyForTwoTotalBalls).toFixed(2)+'元');
				$('#betMoneyForThreeTotalBalls').text(parseFloat(dxDetail.betMoneyForThreeTotalBalls).toFixed(2)+'元');
				$('#betMoneyForFourTotalBalls').text(parseFloat(dxDetail.betMoneyForFourTotalBalls).toFixed(2)+'元');
				$('#betMoneyForFiveTotalBalls').text(parseFloat(dxDetail.betMoneyForFiveTotalBalls).toFixed(2)+'元');
				$('#totalExpense').text(parseFloat(dxDetail.totalExpense).toFixed(2)+'元');
				$('#profit').text(parseFloat(dxDetail.profit).toFixed(2)+'元');
				$('#betMoneyForPeripheryO2_5').bind('input propertychange', function() {
					var betAmount = $(this).val();
					if(!betAmount) {
						betAmount = 1;
					}
					var betMoneyForOneTotalBalls = (dxDetail.betMoneyForOneTotalBalls * (betAmount / dxDetail.betMoneyForPeripheryO2_5)).toFixed(2);
					$('#betMoneyForOneTotalBalls').text(betMoneyForOneTotalBalls+'元');
					var betMoneyForTwoTotalBalls = (dxDetail.betMoneyForTwoTotalBalls * (betAmount / dxDetail.betMoneyForPeripheryO2_5)).toFixed(2);
					$('#betMoneyForTwoTotalBalls').text(betMoneyForTwoTotalBalls+'元');
					var betMoneyForThreeTotalBalls = (dxDetail.betMoneyForThreeTotalBalls * (betAmount / dxDetail.betMoneyForPeripheryO2_5)).toFixed(2);
					$('#betMoneyForThreeTotalBalls').text(betMoneyForThreeTotalBalls+'元');
					var betMoneyForFourTotalBalls = (dxDetail.betMoneyForFourTotalBalls * (betAmount / dxDetail.betMoneyForPeripheryO2_5)).toFixed(2);
					$('#betMoneyForFourTotalBalls').text(betMoneyForFourTotalBalls+'元');
					var betMoneyForFiveTotalBalls = (dxDetail.betMoneyForFiveTotalBalls * (betAmount / dxDetail.betMoneyForPeripheryO2_5)).toFixed(2);
					$('#betMoneyForFiveTotalBalls').text(betMoneyForFiveTotalBalls+'元');
					var TotalExpense = ((parseFloat(betAmount ? betAmount : 0) + parseFloat(dxDetail.betMoneyForOneTotalBalls) + parseFloat(dxDetail.betMoneyForTwoTotalBalls) + parseFloat(dxDetail.betMoneyForThreeTotalBalls) + parseFloat(dxDetail.betMoneyForFourTotalBalls) + parseFloat(dxDetail.betMoneyForFiveTotalBalls)) * (betAmount / dxDetail.betMoneyForPeripheryO2_5)).toFixed(2);
					$('#TotalExpense').text(TotalExpense+'元');
					var profit = (dxDetail.profit * (betAmount / dxDetail.betMoneyForPeripheryO2_5)).toFixed(2);
					$('#profit').text(profit+'元');
					$(this).val(betAmount);
				});
			});
		}
	</script>
</body>
</html>
